<template>
	<view>
		<view class="lineGray"></view>
		<view class=" line textTab ">
			<view class="bigEmpty"></view>
			<view :class="{textTab1:tabIndexCategory==1}" @click="changeCategory(1)">
				<view class="padding"><text>充值</text></view>
				<view v-show="tabIndexCategory==1" class="line-black" style="margin-left: 20px; margin-right: 20px;">
				</view>
			</view>
			<view :class="{textTab1:tabIndexCategory==2}" @click="changeCategory(2)" class="marginLeft">
				<view class="padding"><text>消费</text></view>
				<view v-show="tabIndexCategory==2" class="line-black" style="margin-left: 20px; margin-right: 20px;">
				</view>
			</view>
			<view class="bigEmpty"></view>
		</view>
		<view class="lineGray margin-top-0"></view>

		<view v-for="(item,index) in data" :key="item.index">

			<view class=" marginLeft marginTop textBlack24 bold">{{item.key}}</view>
			<view v-for="(item1,index1) in item.value" :key="index1">
				<view>
					<view class="marginLeft marginTop"> <text class="textblack16 bold">{{item1.content}}<text v-show="item1.usePermission">(使用权益卡)</text> <text v-show="item1.useFastPermission">(使用权益卡)</text> </text></view>
					<view class="line marginLeft marginTop marginBottom">
						<view class="textgray14 bigEmpty"> {{item1.updateTimeShortFormat}}</view>
						<view class="marginLeft textgray14"> {{item1.coin}}</view>
						<image class="marginLeft icon-normal marginRight" src="../../static/orangestar.png"></image>
					</view>
					<view class="lineGray marginLeft marginTop marginRight"></view>
				</view>
			</view>
		</view>

	</view>
</template>

<script>
	import request from "/common/request.js";
	export default {
		data() {
			return {

				data: [],
				tabIndexCategory: 1
			}
		},
		onShareAppMessage(res) {
			return {
				title: '设辑-产品设计智能生成AI',
				path: '/pages/HomePage/HomePage',
				imageUrl: '/static/black-logo.png'
			}
		},
		// 自定义页面的分享到朋友圈
		onShareTimeline(res) {
			return {
				title: '设辑-产品设计智能生成AI',
				path: '/pages/HomePage/HomePage',
				imageUrl: '/static/black-logo.png'
			}
		},
		onReady: function() {
			this.requstData();
		},
		methods: {
			changeCategory(num) {
				this.tabIndexCategory = num;
				this.data = []
				this.requstData();
			},
			requstData() {
				const that = this;
				const url = getApp().globalData.apiUrl + "/api/v1/coinlog/mine";

				request(url, "GET", {
						state: this.tabIndexCategory
					}, uni.getStorageSync("token"))
					.then(function(res) {
						console.log('返回正确回调', res)
						that.data = that.data.concat(res.data);
					}, function(err) {
						console.log('返回错误回调', err)

					})
			}
		}
	}
</script>

<style>
	@import url("../../common/uni.css");
</style>